<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数组引用</title>
</head>
<body>
    <p id="demo">点击按钮。</p>
    <p id='demo1'></p>
    <button onclick="myFunction()">点我</button>
    <script>
        var num = 'hello world';
        var num1 = num;

        // 引用类型：arr1和arr2是同哥数组
        // console.log(arr1)
        // var arr1 = [1,2,3,'可爱','想']
        // var arr2 = arr1;
        // console.log(arr2);
        
        // concat连接数组
        // var arr1 = [1,2,3,'可爱','想']
        // var arr2 = [4,5,6];
        // var arr3 = [7,8,9];
        // var children = arr1.concat(arr2,arr3); //连接三个及更多
        // var children = arr1.concat(arr2); //连接两个数组，并返回存储
        // console.log(children);

        // join将数组以字符串的形式输出
        // function myFunction(){
        //     var arr = [1,2,3,'keai']
        //     var x = document.getElementById('demo')
        //     // console.log(x);
        //     x.innerHTML = arr.join();
        // }


        // pop 删除数组的最后一个值    
        function myFunction(){
            var arr = [1,2,3,'keai']
            arr.pop();
            var x = document.getElementById('demo')
            // console.log(x);
            x.innerHTML = arr;
            console.log(arr.length)
        }

        // push 在数组最后增加值
        function myFunction(){
            var arr = [1,2,3,'keai']
            arr.push('xiangr');
            var x = document.getElementById('demo')
            // console.log(x);
            x.innerHTML = arr;
            console.log(arr.length)
        }

        // shift删除数组的第一个值
        function myFunction(){
            var arr = [1,2,3,'keai']
            var del = arr.shift()
            var x = document.getElementById('demo')
            var x1 =document.getElementById('demo1')
            // console.log(x);
            x.innerHTML = arr;
            console.log(arr.length)
            x1.innerHTML = del;
        }

        // unshift在数组开头添加一个或者多个元素，并返回结果
        function myFunction(){
            var arr = [1,2,3,'keai']
            var lg = arr.unshift('可可','爱爱')
            var x = document.getElementById('demo')
            var x1 =document.getElementById('demo1')
            // console.log(x);
            x.innerHTML = arr;
            console.log(arr.length)
            x1.innerHTML = lg;
        }

        // reverse颠倒数组的顺序
        function myFunction(){
            var arr = [1,2,3,'keai']
            arr.reverse();
            var x = document.getElementById('demo')
            // console.log(x);
            x.innerHTML = arr;
        }

        // slice 从已有数组返回选定的元素
        function myFunction(){
            var arr = [1,2,3,'keai','ke']
            var k = arr.slice(1,3);
            var x = document.getElementById('demo')
            // console.log(x);
            x.innerHTML = k;
        }
        
        //sort 对数组元素进行排序
        // function myFunction(){
        //     var arr = [4,3,5,'keai','aple']
        //     // arr.sort(); // 只对字母进行排序，升序
        //     // arr.sort(function(a,b){return a-b})  //升序排列
        //     arr.sort(function(a,b){return b-a}) //降序排列
        //     var x = document.getElementById('demo')
        //     // console.log(x);
        //     x.innerHTML = arr;
        // }

        // splice 删除元素并向元素添加新的元素 splice(值1，值2，值3)
        // 值1 代表数组元素的位置，即索引 值2 删除几个元素 值3 需要添加的数组元素
        // function myFunction(){
        //     var arr = [1,2,3,'keai']
        //     arr.splice(3,1,'xiangr','bu','nibuxiang');
        //     var x = document.getElementById('demo')
        //     // console.log(x);
        //     x.innerHTML = arr;
        // }

        // tostring 把数组转化成字符串
        // function myFunction(){
        //     var arr = [1,2,3,'keai']
        //     var x1 =  arr.toString();
        //     console.log(x1)
        //     var x = document.getElementById('demo')
        //     // console.log(x);
        //     x.innerHTML = x1;
        // }
    </script>
</body>
</html>